<%@ page import="dao.UserDao" %>
<%@ page import="bean.ShopBean" %>
<%@ page import="java.util.List" %><%--
  Created by IntelliJ IDEA.
  User: laterstage
  Date: 2022/10/15
  Time: 14:47
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>Shop</title>
  <!--  popper.min.js 用于弹窗、提示、下拉菜单 -->
  <script src="${pageContext.request.contextPath}/js/js/popper.min.js"></script>
  <link rel="stylesheet" href="${pageContext.request.contextPath}/js/css/bootstrap.min.css">
  <!-- 最新的 Bootstrap5 核心 JavaScript 文件 -->
  <script src="${pageContext.request.contextPath}/js/js/bootstrap.min.js"></script>

  <style type="text/css">
    /* 在这里写CSS */

    .clearfix::before,
    .clearfix::after{
      display: table;
      clear: both;
      content: '';

    }
    .w{
      /* 固定容器宽度 */
      width: 1200px;
      /* 居中 */
      margin: 0 auto;
      margin-bottom: 20px;
    }
    .ww{

      /* 固定容器宽度 */

      width: 300px;

      /* 居中 */

      margin: 0 auto;

    }
    .boot{


      height: 40px;
      line-height: 40px;

    }
    body{
      background-color: #FFFFFF;
      font: 14px/1.5 Helvetica Neue,Helvetica,Arial,Microsoft Yahei,Hiragino Sans GB,Heiti SC,WenQuanYi Micro Hei,sans-serif;
    }
    .l{

      float: left;
      height: 40px;
      line-height: 40px;
      font-size: 12px;
      color: #b0b0b0;
    }

    .r{
      float: right;
      height: 40px;
      line-height: 40px;
      font-size: 12px;
      color: #b0b0b0;
    }
    .store_bo{
      width: 250px;
      height: 390px;
      background-color: red;
      margin-top: 20px;
      margin-right: 15px;
      float: left;
    }
    /* 按钮与文本样式 */
    .store_si{

      width: 250px;
      height: 250px;
      background-color: wheat;
    }
    .store_dete{

      width: 250px;
      height: 121px;
      margin-top: 19px;
      background-color: #EEEEEE;

    }

    .store_pri{
      width: 230px;
      height: 22px;
      padding-left: 10px;
      padding-right: 10px;
      margin-top: 11px;

      font-size: 18px;
    }
    .store_priname{
      width: 230px;
      height: 22px;
      color: #3d3d3d;;
      padding-left: 10px;
      padding-right: 10px;
      margin-top: 11px;
    }
    .sh{
      padding: 0 20px;
      vertical-align: top;
      box-sizing: border-box;
      border: 1px grey solid;
      border-right: 0;
      border-radius: 10px 10px 0 0 ;
      box-shadow: 0 0 10px 2px #b0b0b0;
      margin-bottom: 20px;




    }
  </style>
</head>
<body style="background: antiquewhite">
<div class="container">
  <div class="row clearfix">
    <!--来一图片-->

    <div class="col-md-12 row">
      <div class="col-md-4"></div>
      <div class="col-md-4"></div>
      <div class="col-md-4"></div>

    </div>
    <!--导航栏-->
    <div class="col-md-12 column">

      <form role="search" action="${pageContext.request.contextPath}/ShowShopServlet" method="post">

        <ul class="nav">
          <li class="nav-item">
            <a class="nav-link" style="color: #333333" href="javascript:location.reload();">百货商城</a>
          </li>
          <li class="nav-item">
            <input type="text" style="color: #333333" class="form-control" name="name" placeholder="Search">
          </li>
          <li class="nav-item">
            <button class="btn btn-primary" type="submit" >查找商品</button>
          </li>
          <li class="nav-item">
            <a  class="btn btn-primary" href="./addShop.jsp" target="_blank" >添加商品</a>
          </li>


        </ul>
      </form>



      <div class="col-md-12 row" >
        <%

          String res = (String) request.getSession().getAttribute("res");
          String serch = (String) request.getSession().getAttribute("search");//代表是否搜索

          if (serch == null) {
            //代表是没有搜索的状态
            if (res == null) {
              request.getSession().setAttribute("res", "1");
              res = "1";
            }

            List<ShopBean> list = new UserDao().showShop(res);
            int num = 0;
            for (ShopBean shopBean : list) {
              num++;
              if (num % 4 == 1) {
                out.write("<div class=\"row\">");

              }
              out.write("<div class=\"col-md-3 sh\">");
              out.write("<div class=\"store_bo \">");
              out.write("<div  class=\"store_si\"><img class=\"store_si\" style=\"width: 200px;height: 200px\" src=\"./images/"+shopBean.getPath()+"\" ></div>");
              out.write("<div class=\"store_dete\">");
              out.write("<div class=\"store_pri\">");
              out.write("<span>"+shopBean.getName()+"</span>");
              out.write("<strong>"+shopBean.getPrice()+"</strong>");
              out.write("</div>");
              out.write("<div class=\"store_priname\">");
              out.write("<span>"+shopBean.getContenct()+"</span>");
              out.write("<div >查看详情</div>");
              out.write("</div>");

              out.write("<a  href=\"./detailShop.jsp?id=" + shopBean.getId() + "\" class=\"btn btn-primary\">查看详情</a>");

              out.write("</div>");
              out.write("</div>");
              out.write("</div>");
              if (num % 4 == 0) {
                out.write(" </div>");

              }

            }

          } else {
            //代表搜索的状态
            request.getSession().removeAttribute("search");
            List<ShopBean> list =(List<ShopBean>)request.getSession().getAttribute("list");
            int num = 0;
            for (ShopBean shopBean : list) {
              num++;
              if (num % 4 == 1) {
                out.write("<div class=\"row\">");

              }
              out.write("<div class=\"col-md-3  sh\">");
              out.write("<div class=\"store_bo \">");
              out.write("<div class=\"store_si\"><img style=\"width: 200px;height: 200px\" class=\"store_si\" src=\"./images/"+shopBean.getPath()+"\" ></div>");
              out.write("<div class=\"store_dete\">");
              out.write("<div class=\"store_pri\">");
              out.write("<span>"+shopBean.getName()+"</span>");
              out.write("<strong>"+shopBean.getPrice()+"</strong>");
              out.write("</div>");
              out.write("<div class=\"store_priname\">");
              out.write("<span>"+shopBean.getContenct()+"</span>");
              out.write("<div >查看详情</div>");
              out.write("</div>");

              out.write("<a  href=\"./detailShop.jsp?id=" + shopBean.getId() + "\" class=\"btn btn-primary\">查看详情</a>");

              out.write("</div>");
              out.write("</div>");
              out.write("</div>");
              if (num % 4 == 0) {
                out.write(" </div>");

              }

            }


          }


        %>




      </div>

      <ul class="pagination">

        <%
          if (serch == null) {
            out.write("<li class=\"page-item\"><a class=\"page-link\" href=\"PageCountServlet?id=pr\">&laquo;</a></li>");
            int count = new UserDao().getCount();//总共的数量
            int pages = count / 8 + 1;
            for (int i = 1; i <= pages; i++) {
              //
              String re=(String) request.getSession().getAttribute("res");
              if(re.equals(String.valueOf(i))){
                out.write("<li class=\"page-item active\"><a  class=\"page-link\" href=\"PageCountServlet?id=" + String.valueOf(i) + "\">" + String.valueOf(i) + "</a></li>");
              }else{
                out.write("<li class=\"page-item \"><a class=\"page-link\" href=\"PageCountServlet?id=" + String.valueOf(i) + "\">" + String.valueOf(i) + "</a></li>");
              }

            }

            out.write("<li class=\"page-item\"><a class=\"page-link\" href=\"PageCountServlet?id=ne\">&raquo;</a></li>");
          }

        %>


      </ul>
    </div>


  </div>



</div>




</body>
</html>

